<template>
	<view>
		<!-- <u-navbar :is-back="false" :is-fixed="true" title="基地"></u-navbar> -->
		<!-- Tab navigation -->
		<view class="fixed-top bg-white">
			<view class="px-2 mt-2 pb-2">
				<u-search placeholder="请输入关键字 " height="60" border-color="#8ED0F2" search-icon-color="#8ED0F2"
					bg-color="#fff" v-model="keyword" :action-style="actionStyle" @input="search"></u-search>
			</view>
			<u-gap height="20" bg-color="#f7f7f7"></u-gap>
		</view>
		<scroll-view scroll-y scroll-with-animation style="height: calc(100vh - 50px)" :show-scrollbar="false"
			@scrolltolower="loadMore" @scrolltoupper="refresh">
			<view class="p-2" style="margin-top: 60px">
				<view class="dfex u-lines pb-2" v-for="(item, index) in list">
					<view class="lineHight">
						<view class="text-333333 font-14">{{ item.baseName || '-' }}</view>
						<view class="text-A0A0A0 font-12">企业名称：{{ item.agricultureUserId_dictText || '-' }}</view>
						<view class="text-A0A0A0 font-12">联 系 人：{{ item.contacts || '-' }}</view>
					</view>
					<view class="bg-78AB06 py-1 pl-2 pr-2 rounded-circle font-14 text-white"
						@click="open('tabbar/market/downstreamDetails', item)">查看详情</view>
				</view>
			</view>
			<view v-if="!hasMore && list.length > 0" class="text-center mt-3 mb-3 pb-2">
				<view class="text-muted">没有更多数据了</view>
			</view>
			<view v-else-if="!hasMore && list.length === 0" class="text-center mt-3 mb-3">
				<view class="icon-sousuo1 iconfont text-999999" style="font-size: 55px;"></view>
				<view class="text-999999 font-15">暂时木有内容呀~~</view>
			</view>
			<view v-else class="text-center mt-3 mb-3">
				<view class="btn btn-primary">加载更多</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import $H from '@/common/free-lib/request.js'
	export default {
		data() {
			return {
				scrollinto: '',
				keyword: '',
				actionStyle: {
					color: '#8ED0F2',
				},
				form: {
					pageNo: 1,
					pageSize: 10,
					total: 0 // 总页数
				},
				hasMore: true, // 是否还有更多数据
				list: [],
			};
		},
		onLoad() {
			// 初始化加载数据
			this.getList();
		},
		methods: {
			setDefaultPageConfig() {
				this.form.pageNo = 1;
				this.form.pageSize = 10;
				this.form.total = 0;
			},
			open(path, item) {
				uni.navigateTo({
					url: `/pages/${path}?item=${JSON.stringify(item)}`,
				});
			},
			//查询
			search() {
				this.setDefaultPageConfig();
				this.list = [];
				this.hasMore = true;
				this.getList();
			},
			getList() {
				if (!this.hasMore) return;

				$H.get('/agriculture/baseInform/down/list', {
					...this.form,
					baseName: this.keyword.trim(),
				}, {
					token: true
				}).then((res) => {
					if (this.form.pageNo === 1) {
						this.list = res.result.records || [];
					} else {
						this.list = [...this.list, ...res.result.records];
					}

					this.form.total = res.result.total;
					this.hasMore = this.list.length < this.form.total;
				}).catch(() => {
					this.hasMore = false; // 请求失败时停止加载更多
				});
			},
			// 加载更多
			loadMore() {
				if (!this.hasMore) return;

				this.form.pageNo++;
				this.getList();
			},
			// 下拉刷新
			refresh() {
				this.setDefaultPageConfig();
				this.list = [];
				this.hasMore = true;
				this.getList();
				uni.stopPullDownRefresh(); // 停止下拉刷新动画
			},
		},
	};
</script>
<!--  -->

<style lang="scss" scoped>
	.tab-scroll {
		width: 100vw;
	}

	.tab-item {
		width: 50%;
		display: inline-block;
		text-align: center;
		padding: 0 10px;
		line-height: 40px;
	}
</style>